<!--
Author: xmoban.cn
Author URL: http://www.xmoban.cn
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>Invent a Corporate Business Category Bootstrap Responsive website Template | Gallery :: xmoban.cn</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Invent Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template, 
	SmartPhone Compatible web template, free WebDesigns for Nokia, Samsung, LG, Sony Ericsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- Custom Theme files -->
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css" rel="stylesheet" media="all">
<link href="css/style.css" type="text/css" rel="stylesheet" media="all">   
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!-- font-awesome icons -->
<link href='css/simplelightbox.css' rel='stylesheet' type='text/css'>  
<!-- //Custom Theme files --> 
<!-- js -->
<script src="js/jquery-2.2.3.min.js"></script>  
<!-- //js -->
<!-- web-fonts -->  
<link href="//fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300i,700" rel="stylesheet"> 
<link href='//fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<!-- //web-fonts -->
</head>
<body> 
	<!-- banner -->
	<div class="agileits-banner w3-agileabout-banner">  
		<!-- navigation -->
		<div class="top-nav w3-agiletop">
			<div class="container">
				<div class="navbar-header w3llogo">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button> 
					<h1><a href="index.html"><span class="glyphicon glyphicon-signal" aria-hidden="true"></span> Invent</a></h1> 
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
				<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
					<div class="w3menu navbar-left">
						<ul class="nav navbar">
							<li><a href="index.html">Home</a></li>
							<li><a href="about.html">About</a></li> 
							<li><a href="gallery.html" class="active">Gallery</a></li>
							<li><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span data-letters="Pages">Pages</span><span class="caret"></span></a>
								<ul class="dropdown-menu"> 
									<li><a href="icons.html">Web Icons</a></li>
									<li><a href="codes.html">Short Codes</a></li>
								</ul>
							</li>  
							<li><a href="contact.html">Contact</a></li>
						</ul>
					</div>
					<div class="w3ls-bnr-icons social-icon navbar-right">
						<a href="#" class="social-button twitter"><i class="fa fa-twitter"></i></a>
						<a href="#" class="social-button facebook"><i class="fa fa-facebook"></i></a> 
						<a href="#" class="social-button google"><i class="fa fa-google-plus"></i></a> 
						<a href="#" class="social-button dribbble"><i class="fa fa-dribbble"></i></a> 
					</div> 
					<div class="clearfix"> </div>  
				</div>
			</div>	
		</div>	
		<!-- //navigation --> 
		<div class="banner-w3text w3layouts aboutw3l-bnrtext">
			<h2><span>Gallery</span></h2>  
		</div>  
	</div>
	<!-- //banner -->  
	<!-- gallery -->
	<div class="gallery w3-agileits">  
		<div class="container"> 
			<h3 class="agileits-title">Our Gallery</h3> 
			<div class="agileinfo-gallery-row">
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g1.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g1.jpg" class="img-response" alt="" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div> 
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g2.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g2.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g3.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g3.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g4.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g4.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g5.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g5.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div> 
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g6.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g6.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/g7.jpg" class="imghvr-hinge-right wthree">
						<img src="images/g7.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/img1.jpg" class="imghvr-hinge-right wthree">
						<img src="images/img1.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="col-md-4 col-sm-4 col-xs-6 w3gallery-grids">
					<a href="images/img2.jpg" class="imghvr-hinge-right wthree">
						<img src="images/img2.jpg" alt="" class="img-response" title="Invent Image"/> 
						<div class="agile-figcaption">
						  <h4>Invent</h4>
						  <p>Phasellus elementum ullamcorper urna, eu rhoncus.</p>
						</div>
					</a> 
				</div>
				<div class="clearfix"> </div>
				<script type="text/javascript" src="js/simple-lightbox.min.js"></script>
				<script>
					$(function(){
						var gallery = $('.agileinfo-gallery-row a').simpleLightbox({navText:['&lsaquo;','&rsaquo;']});
					});
				</script>  
			</div> 
		</div>
	</div>
	<!-- //gallery -->  
	<!-- footer -->
	<div class="footer">
		<div class="container">
			<div class="footer-row w3l-newsletter"> 
				<div class="col-md-6 w3_agile_newsletter_left">
					<h4>Subscribe Newsletter</h4>
				</div>
				<div class="col-md-6 w3_agile_newsletter_right">
					<form action="#" method="post">
						<input type="email" name="Email" placeholder="Email..." required="">
						<input type="submit" value="Subscribe">
					</form>
				</div>
				<div class="clearfix"> </div> 
			</div> 
			<div class="footer-bottom">
				<div class="col-sm-4 col-xs-4 footer-grids">
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do 
						eiusmod tempor incididunt ut labore et dolore magna aliqua. 
						Ut enim ad minim veniam.</p>
					<h6>consectetur<a href="#"> Christ Richard.</a> </h6>
				</div>
				<div class="col-sm-4 col-xs-4 footer-grids footer-mdl">
					<div class="col-md-6 col-xs-6 grid-left">
						<ul>
							<li><a href="index.html"><i class="fa fa-angle-right"></i>Home</a></li>
							<li><a href="about.html"><i class="fa fa-angle-right"></i>About</a></li>
							<li><a href="gallery.html"><i class="fa fa-angle-right"></i>Gallery</a></li>
							<li><a href="icons.html"><i class="fa fa-angle-right"></i>Web Icons</a></li>
						</ul>	
					</div>
					<div class="col-md-6 col-xs-6 grid-left">
						<ul>
							<li><a href="codes.html"><i class="fa fa-angle-right"></i>Short Codes</a></li>
							<li><a href="contact.html"><i class="fa fa-angle-right"></i>Contact</a></li> 
							<li><a href="about.html"><i class="fa fa-angle-right"></i>Team</a></li>
						</ul>	
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="col-sm-4 col-xs-4 footer-grids">
					<ul>
						<li class="phn"><i class="fa fa-phone"></i>1111-111-111</li>
						<li><a href="mailto:example@mail.com"><i class="fa fa-envelope-o"></i> mail@example.com</a></li>
					</ul>
					<p>© 2017 Invent . All rights reserved | Design by <a href="http://www.xmoban.cn">xmoban.cn</a></p>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<!-- footer -->  
	<!-- start-smooth-scrolling -->
	<script src="js/SmoothScroll.min.js"></script> 
	<script type="text/javascript" src="js/move-top.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>	
	<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
			
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
				});
			});
	</script>
	<!-- //end-smooth-scrolling -->	
	<!-- smooth-scrolling-of-move-up -->
	<script type="text/javascript">
		$(document).ready(function() {
			/*
			var defaults = {
				containerID: 'toTop', // fading element id
				containerHoverID: 'toTopHover', // fading element hover id
				scrollSpeed: 1200,
				easingType: 'linear' 
			};
			*/
			
			$().UItoTop({ easingType: 'easeOutQuart' });
			
		});
	</script>
	<!-- //smooth-scrolling-of-move-up -->    
	<!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/bootstrap.js"></script>
</body>
</html>